<template>
	<view>
		<Header type="back" to="back" title="今日推荐"/>
		<view class="w-100" :class="'h'+bar_height"></view>
		
		<view class="w-100 h1356 bg-f8ff ty-use re" :style="'height:'+(height*1+80)+'rpx'">
			<scroll-view class="scroll-view_H uni-scroll top30" scroll-y="true">
				<view class="w-100 fs-b-b pb-3 px-2-6">
					<view class="w340 h452 mb-2 circle20 show0 ov-hd" v-for="(item,index) in shop_list_nice" :key="item.id" @click="set_shop(item)">
						<ImageFile :url="item.thumbnail" className="w340 h378"/>
						<view class="w-100 h90 bg-theme mt-f20 re px-1 pt-1">
							<HornMarginTheme type="left-top"></HornMarginTheme>
							<view class="w-100 font24 font600 t-20">{{item.name}}</view>
							<view class="w-100 h24 f-y-c font24 t-20 font600"><text class="font18 font400">¥</text>{{item.price}}</view>
						</view>
					</view>
				</view>
				<view class="w-100 h140"></view>
				<view class="w-100 t-a font24 t-3 pt-12 pb-1" v-if="shop_list_nice.length == 0">暂无数据</view>
			</scroll-view>
		</view>
	
	</view>
	
</template>

<script>
import Header from "../../components/header.vue"
import HornMarginTheme from "../../components/horn_margin_theme.vue"
import ImageFile from "../../components/img_file.vue"
	
import {mallList} from "../../api/shop.js"

export default{
	components:{
		Header,
		HornMarginTheme,
		ImageFile,
	},
	data(){
		return{
			height:0,
			bar_height:0,
			shop_list_nice:[],
			query:{
				currentPage:1,
				pageSize:10,
				name:"",
				categoryId:'', // 分类id
				type:1, //类型 1：金额购买/2：积分兑换
				recommend:true,
			}
		}
	},
	created() {
		this.get_mall_list_nice()
		this.bar_height = uni.getStorageSync("toprpx") //顶部高度
		this.height = uni.getStorageSync("map_height") //其他页面使用的高度
		
	},
	methods:{
		set_shop(val){
			uni.setStorageSync("shop_details",val)
			uni.navigateTo({
				url:"/pages/shop/details"
			})
		},
		async get_mall_list_nice(){
			const {body:{records},code} = await mallList(this.query)
			if(code === '0'){
				this.shop_list_nice = records || []
			}
		},
	}
}
</script>

<style lang="scss" scoped>
	.ty-use{
		border-radius:  0 80rpx 0 0 ;
	}
	.scroll-view_H{
		position: absolute;
		left: 0;
		bottom: 0;
		right: 0;
		z-index: 9;
	}
	.mt-f20{
		margin-top: -12rpx;
		border-radius: 0 20rpx 0 0 ;
	}
</style>
